<template>
    <div>
        <div class="head">
            <h1>{{$route.query.studentName}}</h1>
        </div>
         <div class="second-contain-box ma">
            <el-row>
                <el-col :span="12"><span>跟进次数：</span><span>{{stuTableData.studentInfo.trackingNum}}</span></el-col>
                <el-col :span="12"><span>跟进时间：</span><span>{{stuTableData.studentInfo.trackingDate}}</span></el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                 <div class="inputbox">
                    联系人：{{stuTableData.studentTrackingInfo.contactPeople}}
                  </div>
                </el-col>
                <el-col :span="12">
                  <span>沟通形式：{{contractType}}</span>
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12">
                  <span>客户类型：{{stuTableData.studentInfo.type}}</span>
                </el-col>
                <el-col :span="12">
                  <span>客户进展：{{stuTableData.studentInfo.progress}}</span>
                  </el-col>
            </el-row>
            <el-row>
                <el-col :span="24">
                   <div class="inputbox">
                      沟通内容：{{stuTableData.studentTrackingInfo.contractContent}}
                   </div>  
                </el-col>
            </el-row>
            <el-row>
                <el-col :span="12"><span>跟进人：{{stuTableData.studentTrackingInfo.trackingPeople}}</span></el-col>
                <el-col :span="12">
                   <div class="inputbox">
                     下次跟进日期：{{stuTableData.studentTrackingInfo.nextContractDate}}
                   </div>  
                </el-col>
            </el-row>
        </div>
        <KtButton
        :label="$t('action.close')"
        perms="true"
        type="primary"
        size="medium"
        style="margin-right: 2%;margin-top:2%"
        @click="closeSelectedTag()"
      ></KtButton>
        <!-- <kt-button class="stu-btn" :label="$t('action.close')" perms="" size="medium" @click="handleClose()" /> -->
    </div>
</template>
<script>
import { hasPermission } from "@/permission/index.js";
import axios from "axios";
import KtButton from "@/views/Core/KtButton";
import api from "@/http/api";
import Cookies from "js-cookie"
import CrmTable from "@/views/Core/CrmTable";
export default {
  name: "AddStudentFollow",
  components: {
    KtButton,
    CrmTable
  },
  data() {
    return {
      filters: {
        name: ""
      },
      // 客户跟进数据
      pageResult: {},
      student_type_options:[],
      student_progress_options:[],
      pageRequest: { pageNum: 1, pageSize: 8 },
      stuTableData: {},
      saveData:{
        customerType:'',
        contractDate:'',
        customerProgress:'',
        contractContent:'',
        nextContractDate:'',
        contactPeople:'',
        studentId:this.$route.query.id
      },
      trackingPeople:Cookies.get('realName'),
      student_communication_type:[],
    };
  },
  watch: {
    // $route: "getParams"
  },
  beforeMount: function() {
  },
  methods: {
    hasPerms: function(perms) {
      // 根据权限标识和外部指示状态进行权限判断
      return hasPermission(perms) & !this.disabled;
    },
    handleClose() {
      this.$router.push({ path: "/Customer/Stu" });
    },
    // 获取分页数据
    get_page_data: function() {
      this.$api.student
        .stuqueryTrackingInfo({
          id:this.$route.query.id
        })
        .then(res => {
          this.stuTableData=res.studentTrackingDetail
          this.contractType=this.stuTableData.studentTrackingInfo.contractType==1?"电话":"微信"
          this.student_type_options.forEach(item => {
            if(item.key==this.stuTableData.studentInfo.type){
              this.stuTableData.studentInfo.type=item.value
            }
          });
          this.student_progress_options.forEach(item=>{
             if(item.key==this.stuTableData.studentInfo.progress){
              this.stuTableData.studentInfo.progress=item.value
            }
          })
          
        })
    },
    get_student_type() {
      this.student_type_options=JSON.parse(localStorage.getItem('stdentTpye'))
    },
    get_student_progress() {
      this.student_progress_options=JSON.parse(localStorage.getItem('studenProgress'))
    },
    get_contractType(){
      this.student_communication_type=JSON.parse(localStorage.getItem('studentContractType'))
    },
    isActive(route) {
      return route.path === this.$route.path;
    },
    closeSelectedTag(view) {
      this.$store.dispatch("delVisitedViews", this.$route).then(views => {
        if (this.isActive(this.$route)) {
          const latestView = views.slice(-1)[0];
          if (latestView) {
            this.$router.push(latestView);
          } else {
            this.$router.push("/");
          }
        }
      });
    }   
  },  
  mounted() {
    this.get_page_data()
    this.get_student_type()
    this.get_student_progress()
    this.get_contractType()
  }
};
</script>
<style lang='scss' scoped>
.second-contain-box{
  width: 95%;
  margin: 0 auto;
  .el-col{
    text-align: left;
    margin: 20px 0;
  }
}
.inputbox{
  display: flex;
  flex-direction: row;
  span{
    display: block;
    width: 10%;
  }
  .el-input{
    width: 50%;
  }
  .el-textarea{
    float: left;
    margin-left: -4%;
  }
}

</style>
<style lang="scss">

</style>






